import Vue from 'vue';
import App from './App.vue';
import Storage from 'vue-ls';
import config from './defaultSettings.js';
import router from './router';
import store from './store';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import API from './api/index.js';
import './assets/css/animation.css';   // 个人动画css
import Animation from './mixins/all-animation';   // 个人工具类
// import './mock/index';
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
// 全局注册组件用
import upperFirst from 'lodash/upperFirst';
import camelCase from 'lodash/camelCase';
// 指令
import directive from './directive/index';
import Print from 'vue-print-nb'


/* 全局注册自定义组件 */
const requireComponent = require.context('./components/common',true,/\.vue$/);
requireComponent.keys().forEach(fileName => {
  // 获取组件配置
  const componentConfig = requireComponent(fileName);
  // 获取组件的 PascalCase 命名
  const componentName = upperFirst(
    camelCase(
      // 获取和目录深度无关的文件名
      fileName
        .split('/')
        .pop()
        .replace(/\.\w+$/, '')
    )
  )
  Vue.component(
    componentName,
    // 如果这个组件选项是通过 `export default` 导出的，
    // 那么就会优先使用 `.default`，
    // 否则回退到使用模块的根。
    componentConfig.default || componentConfig
  )
})

Vue.config.productionTip = false;
Vue.prototype.$ajax = API;
Vue.prototype.$ls = Vue.ls;

Vue.use(ElementUI);
Vue.use(Storage, config.storageOptions);
Vue.use(directive);
Vue.use(Print)

//全局混入动画方法
Vue.mixin(Animation);



router.beforeEach((to, from, next) => {
  NProgress.start();
  if (to.path == '/' || to.path == '/login') {
    store.commit('DEL_TAB_ALL',to);
    next()
  }else{
    if(Vue.ls.get('token') == null){
      store.commit('DEL_TAB_ALL',to);
      next({ path: '/'});
    }else{
      store.commit('ADD_TABS',to);
      store.commit('SET_BUTTONS',to.meta.buttons);
      next();
    }
  }
})

router.afterEach(() => {
  NProgress.done()
})
window.vm = new Vue({
  store,
  router,
  created(){
    store.commit('SET_MENU',Vue.ls.get('menu'))
    store.commit('SET_ROUTER',Vue.ls.get('menu'))
    store.commit('SET_COLLAPSE',Vue.ls.get('collapse') || false)
  },
  render: h => h(App),
}).$mount('#app')
